<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/bootstrap-theme.css">
<link rel="stylesheet" href="css/myCSS.css">

<script src="js/jquery-2.1.1.js"></script>
<script src="js/bootstrap.js"></script>

</head>

<body>
	<div class="container">
		<div class="page-header">
			<h1 wicket:id="titulo">Titulo de la pagina</h1>
		</div>
		<form wicket:id="eform">
		

		<div class="col-sm-4">
			<div>
				<table class="table table-striped table-bordered table-condensed">
					<thead>
						<tr>
							<th>Sospechosos</th>
							<div>
								<input type="text" wicket:id="nuevoNombre">
								<button wicket:id="agregarVillano" type="submit" class="glyphicon glyphicon-save" />
							</div>
						</tr>
					</thead>
					<tbody>
						<tr wicket:id="expediente.villanos">
							<td><span wicket:id="nombreDelVillano">nombre del villano</span></td>
							<td id="botonera">
								<div>
									<button wicket:id="seleccionarVillano" type="submit" class="glyphicon glyphicon-edit" />
									<button wicket:id="eliminarVillano" type="submit" class="glyphicon glyphicon-trash" />	
								</div>
							</td>
						</tr>
					</tbody>
				</table>
	
				<div id="botonVolver" class="form-actions">
					<h4></h4>
					<button wicket:id="volver" class="btn btn-success">Volver</button>
				</div>
				
				<div wicket:id="feedbackPanel" class="alert alert-error mostradorDeErrores">
					<h2><strong>Warning!</strong> Best check yourself, you're not looking too good.</h2>
				</div>
			
			</div>
		</div>
		
		<div id="columnaDerecha" class="col-sm-8">
			<div class="row panelEditarPais">
				<h4>Nombre:</h4>
				<h4 wicket:id="villanoSeleccionado.nombre"></h4>
				
			</div>
			<div class="row panelEditarPais">
				<h4>Sexo</h4>
				<h4 wicket:id="villanoSeleccionado.sexo"></h4>
		
			 	<wicket:container wicket:id="group">
				    <label><input wicket:id="indef" type="radio" name="ticker"/>Indefinido</label>
				    <label><input wicket:id="masc" type="radio" name="ticker"/>Masculino</label>
				    <label><input wicket:id="fem" type="radio" name="ticker"/>Femenino</label>
					<button wicket:id="cambioDeSexo" type="submit" class="glyphicon glyphicon-edit" />
				</wicket:container>
					
			</div>
			<div class="row panelEditarPais">
				<h4>Senias</h4>
					<div>
						<input type="text" wicket:id="nuevaCaracteristica"/>
						<button wicket:id="agregarNuevaCaracteristica" type="submit" class="glyphicon glyphicon-edit" />
					</div>
				<tbody>
					<tr wicket:id="villanoSeleccionado.seniasParticulares">
						<div>
							<td>
								<span wicket:id="caracteristicaDelVillano">caracteristica del villano</span>
							</td>
							<td>
								<button wicket:id="eliminarCaracteristica" type="submit" class="glyphicon glyphicon-trash" />			
							</td>
						</div>
					</tr>
				</tbody>
			</div>
			<div class="row panelEditarPais">
				<h4>Hobbies</h4>
					<div>
						<input type="text" wicket:id="nuevoHobbie"/>
						<button wicket:id="agregarHobbie" type="submit" class="glyphicon glyphicon-edit" />
					</div>
				<tbody>
					<tr wicket:id="villanoSeleccionado.hobbies">
						<div>
							<td>
								<span wicket:id="hobbie">caracteristica del villano</span>
							</td>
							<td>
								<button wicket:id="eliminarHobbie" type="submit" class="glyphicon glyphicon-trash" />			
							</td>
						</div>
					</tr>
				</tbody>
			</div>
		
			
			<!div id="botonNuevo" class="form-actions">
				<!h4><!/h4>
				<!button wicket:id="nuevo" class="btn btn-success"><!/button>
			<!/div>
		</div>
		
		
		
	</form>
	</div>
</body>
</html>